import React from 'react';
import ImageLazy from '../commons/ImageLazy';
import NavLink from '../commons/NavLink';


export default React.createClass({
  componentDidMount:function(){
      require('swiper');
      $('.mall_them_weiz .swiper_a,.mall_them_weiz .swiper_b').each(function(index){
        $(this).swiper({
          paginationClickable: true,
          slidesPerView: 'auto',
          calculateHeight:true
        })
      })
  },
  render:function(){
    return(
      <div className="mall_them_weiz">
        <div className="item_wrapper">
          <div className="item">
            <h3 className="tit_sty1">美肤专场<br/><small>Special skin</small></h3>
            <a className="img_txt">
              <ImageLazy src="https://dummyimage.com/750x480/b293a4/b293a4" style={{height:'4.8rem'}} />
              <h4>
                玻尿酸大促<br/><small>口碑产品齐聚，选择困难症的福音</small>
              </h4>
              <p>立即查看 &#9658;</p>
            </a>
            <div className="swiper_a swiper-container">
              <div className="swiper-wrapper">
                <div className="swiper-slide">
                  <div className="wrapper">
                  <div className="pic">
                    <ImageLazy src="https://dummyimage.com/296x300/b293a4/fff" style={{height:'3rem'}} />
                  </div>
                  <div className="det box">
                    <div className="name">伊婉玻尿酸 填充塑形</div>
                    <div className="author">赵琼博士实力操作</div>
                    <div className="price">
                      <span>&yen; 5999.00</span>
                      <i className="iconfont icon-buy_car"></i>
                    </div>
                  </div>
                  </div>
                </div>
                <div className="swiper-slide">
                  <div className="wrapper">
                  <div className="pic">
                    <ImageLazy src="https://dummyimage.com/296x300/b293a4/fff" style={{height:'3rem'}} />
                  </div>
                  <div className="det box">
                    <div className="name">伊婉玻尿酸 填充塑形</div>
                    <div className="author">赵琼博士实力操作</div>
                    <div className="price">
                      <span>&yen; 5999.00</span>
                      <i className="iconfont icon-buy_car"></i>
                    </div>
                  </div>
                  </div>
                </div>
                <div className="swiper-slide">
                  <div className="wrapper">
                  <div className="pic">
                    <ImageLazy src="https://dummyimage.com/296x300/b293a4/fff" style={{height:'3rem'}} />
                  </div>
                  <div className="det box">
                    <div className="name">伊婉玻尿酸 填充塑形</div>
                    <div className="author">赵琼博士实力操作</div>
                    <div className="price">
                      <span>&yen; 5999.00</span>
                      <i className="iconfont icon-buy_car"></i>
                    </div>
                  </div>
                  </div>
                </div>
              </div>
            </div>
            <a className="img_txt">
              <ImageLazy src="https://dummyimage.com/750x480/b293a4/b293a4" style={{height:'4.8rem'}} />
              <h4>
                玻尿酸大促<br/><small>口碑产品齐聚，选择困难症的福音</small>
              </h4>
              <p>立即查看 &#9658;</p>
            </a>
            <div className="swiper_a swiper-container">
              <div className="swiper-wrapper">
                <div className="swiper-slide">
                  <div className="wrapper">
                  <div className="pic">
                    <ImageLazy src="https://dummyimage.com/296x300/b293a4/fff" style={{height:'3rem'}} />
                  </div>
                  <div className="det box">
                    <div className="name">伊婉玻尿酸 填充塑形</div>
                    <div className="author">赵琼博士实力操作</div>
                    <div className="price">
                      <span>&yen; 5999.00</span>
                      <i className="iconfont icon-buy_car"></i>
                    </div>
                  </div>
                  </div>
                </div>
                <div className="swiper-slide">
                  <div className="wrapper">
                  <div className="pic">
                    <ImageLazy src="https://dummyimage.com/296x300/b293a4/fff" style={{height:'3rem'}} />
                  </div>
                  <div className="det box">
                    <div className="name">伊婉玻尿酸 填充塑形</div>
                    <div className="author">赵琼博士实力操作</div>
                    <div className="price">
                      <span>&yen; 5999.00</span>
                      <i className="iconfont icon-buy_car"></i>
                    </div>
                  </div>
                  </div>
                </div>
                <div className="swiper-slide">
                  <div className="wrapper">
                  <div className="pic">
                    <ImageLazy src="https://dummyimage.com/296x300/b293a4/fff" style={{height:'3rem'}} />
                  </div>
                  <div className="det box">
                    <div className="name">伊婉玻尿酸 填充塑形</div>
                    <div className="author">赵琼博士实力操作</div>
                    <div className="price">
                      <span>&yen; 5999.00</span>
                      <i className="iconfont icon-buy_car"></i>
                    </div>
                  </div>
                  </div>
                </div>
              </div>
            </div>
          </div>

        </div>

      </div>
    )
  }
})
